import * as echarts from 'echarts'
let myChart 
export const earchsinit = (el:HTMLDivElement,datalods) => {
    const chartDom = el;
    console.log(datalods)
    if(myChart) myChart.dispose()
     myChart = echarts.init(chartDom);
    chartDom.style.width = '800px'; // 设置初始宽度
    chartDom.style.height = '600px'; // 设置初始高度
    // myChart.resize({ width: chartWidth, height: chartHeight });
    window.addEventListener('resize', () => {
        myChart.resize();
    });
    const option = {
        tooltip: {
            trigger: 'item',
            triggerOn: 'mousemove'
        },
        itemStyle: {
            color: 'blue', // 节点颜色
            // borderColor: 'green', // 节点边框颜色
            borderWidth: 20, // 节点边框宽度
            borderType: 'solid', // 节点边框类型
            shadowColor: 'rgba(0, 0, 0, 0.3)', // 阴影颜色
            shadowBlur: 10, // 阴影模糊大小
        },
        series: [
            {
                type: 'tree',
                id: 0,
                name: 'tree1',
                data: [{ name: '知识体系', children: datalods }],
                top: '10%',
                left: '8%',
                bottom: '22%',
                right: '20%',
                symbol: 'rect',
                symbolSize: [125, 30], //标识大小
                edgeShape: 'polyline',
                edgeForkPosition: '63%',
                initialTreeDepth: 2, //数层级数
                lineStyle: {
                    width: 2
                },
                label: {
                    position: 'right',
                    verticalAlign: 'middle',
                    align: 'left',
                    offset: [-127, 0],
                    show: true,
                    color: '#00173d',
                },
                leaves: {
                    label: {
                        position: 'right',
                        verticalAlign: 'middle',
                        align: 'left',
                    }
                },
                emphasis: {
                    focus: 'descendant'
                },
                expandAndCollapse: true,
                animationDuration: 550,
                animationDurationUpdate: 750
            }
        ]
    };
    myChart.setOption(option);
    myChart.resize();
}